<template>
	
	<view  class="connect">
		<z-paging :show-refresher-when-reload="true"  show-refresher-update-time  ref="paging" v-model="dataList" @query="queryList">
			<!-- z-paging默认铺满全屏，此时页面所有view都应放在z-paging标签内，否则会被盖住 -->
			<!-- 需要固定在页面顶部的view请通过slot="top"插入，包括自定义的导航栏 -->
			
			<view class="index_info" >
				<!-- <u-navbar :is-back="false" back-text=" " :title-color="style.color5" :background="{background:style.color2}" :title-size="30" :title-width="400" title="ATK线上商城（样品展示）"></u-navbar> -->
				<view class="" style="width:100%; height:40rpx;">
					
				</view>
				<view  v-for="(item , index) in index_info" :key="index" class="">
					<swiper-img style="" v-if="item.type==1 && item.status==0"  :style_item="item.style"  :list="item.data"></swiper-img>
					<bar v-if="item.type==1 && item.status==0"></bar>
					<vip v-if="item.type==1 && item.status==0"></vip>
					<view v-if="item.type==2 && item.status==0" class="" :style_item="item.style" style="padding-left: 32rpx;"  @click="gonggao(guanGao_info)">
						<u-notice-bar  
							mode="horizontal"
							:bg-color="item.style.background"
							:volume-icon="true"
							:color="item.style.color"
							padding="18rpx 0rpx"
							:list="gao_arr"
							:speed="100"
							:is-circular="true"
							style="width: 100%; padding: 0;"
						>
						</u-notice-bar>	
					</view>
					<search v-if="item.type==3 && item.status==0" :style_item="item.style" @search_change="search_to($event)"></search>
					<list-type-one v-if="item.type==4 && item.status==0" :style_item="item.style" :list="item.data"></list-type-one>
					<coupon-list v-if="item.type==5 && item.status==0" :style_item="item.style" :list="item.data"></coupon-list>
					<dan-img v-if="item.type==6 && item.status==0"  :style_item="item.style" :list="item.data"></dan-img>
					<shop-list v-if="item.type==8 && item.status==0" :style_item="item.style" :list="item.data"></shop-list>
					<list-group v-if="item.type==9 && item.status==0" :style_item="item.style" :list="item.data"></list-group>
					<indexTitle v-if="item.type==10 && item.status==0" :style_item="item.style" :data="item"></indexTitle>
					<barHeng v-if="item.type==11 && item.status==0" :style_item="item.style" :list="item.data"></barHeng>
					<view v-if="item.type==12 && item.data.length>0?item.data[0].end_time<0:false && item.status==0" class="" >
						<shopTimeGoods :style_item="item.style" :list="item.data" @list_chagne="list_chagne($event , index)" :row="item"></shopTimeGoods>
					</view>
					<view v-if="item.type==13 &&  item.status==0" class="" >
						<listGroup2  :style_item="item.style" :list="item.data"></listGroup2>
					</view>
				</view>
				<view class="" style="padding: 20rpx; ">
					<view class="" style="background-color: #fff; border-radius: 15rpx; overflow: hidden;">
						<shop-list  :list="dataList"></shop-list>
					</view>
				</view>
				
			</view>
		</z-paging>
		<view class="" style="height: 90rpx;"></view>
		<!-- 滚动公告信息 -->
		
		<kefu class="" ></kefu>
        <!-- 公告弹出层 -->
        <liu-popup type="center" ref="center" bgColor="none"  @close="gogngaoClose">
			<view class="GongGao_box">
			    <view class="GongGao_box_img_box">
			        <image src="../../static/icon/gonggao.png" alt="">
			    </view>
			    <view class="" style="height: 85rpx;"></view>
			    <view class="GongGao_box_text_top">
			       
			    </view>
			    <scroll-view :scroll-top="0" scroll-y="true"  class="scroll-Y2">
			    	<view v-html="content" class="GongGao_box_text"></view>
			    </scroll-view>
			    <view @click="todyIS_no" class="GongGao_box_text_icon">
			        <image v-if="isok" style="width: 24rpx;height: 24rpx;margin-right:15rpx;" src="https://www.mengkahuyu.com/index_png/radio_choose.png" mode=""></image>
			        <image v-else style="width: 24rpx;height: 24rpx;margin-right:15rpx;" src="https://www.mengkahuyu.com/index_png/radio.png" mode=""></image>
			        今日不在弹出
			    </view>
				<view class="" style="display: flex; align-items: center; justify-content: center;">
				    <image @click="closeTypeChoose('center')" src="https://www.mengkahuyu.com/index_png/index_close.png" style="width: 65rpx; height: 65rpx;margin-top:25rpx;" alt="">
				</view>
			</view>
        </liu-popup>
		
		<liu-popup type="center" ref="center1" bgColor="none"  @close="gogngaoClose">
			<!-- <view class="couponBox">
				<view class="couponListBox">
					<view class="couponItem" v-for="(item,index) in couponList" :key="index">
						<view class="couponprice">
							{{ Math.trunc(item.money) }}
						</view>
						<view class="coupontext">
							<view class="title">
								{{item.title}}
							</view>
							<view class="remark">
								{{item.remark}}
							</view>
						</view>
					</view>
				</view>
				<view class="take" @click="take()">
					立马收下
				</view>
				<view class="" style="display: flex; align-items: center; justify-content: center;">
				    <image @click="closeTypeChoose1('center1')" src="../../static/icon/closeCoupon.png" style="width: 58rpx; height: 58rpx;margin-top:65rpx;" alt="">
				</view>
			</view> -->
			<view class="couponBox2">
				<image style="width: 100%;" src="../../static/inde_png/index_icon_14.png" mode="widthFix"></image>
				<view class="couponBox2_box">
					<image class="tu-png" src="../../static/inde_png/index_icon_15.png" mode=""></image>
					<view class="coupon_list">
						<view v-for="(item,index) in couponList" :key="index" class="coupon_list_item">
							<view class="coupon_list_item_left">
								¥{{ Math.trunc(item.money) }}
							</view>
							<view class="coupon_list_item_right">
								<veiw class="right_title1 uni-ellipsis">{{item.title}}</veiw>
								<veiw class="right_title2">{{item.remark}}</veiw>
							</view>
						</view>
					</view>
					<view  @click="take()" class="coupon_btn">
						立即领取
					</view>
				</view>
			</view>
		</liu-popup>
	</view>	
</template>
<script type='text/javascript'>
	    (function(a, b, c, d, e, j, s) {
	        a[d] = a[d] || function() {
	            (a[d].a = a[d].a || []).push(arguments)
	        };
	        j = b.createElement(c),
	            s = b.getElementsByTagName(c)[0];
	        j.async = true;
	        j.charset = 'UTF-8';
	        j.src = 'https://static.meiqia.com/widget/loader.js';
	        s.parentNode.insertBefore(j, s);
	    })(window, document, 'script', '_MEIQIA');
	    _MEIQIA('entId', '80d031df9113f6aba13e48cb1583294d');
	    </script>
<script>
	
	
	import kefu from '@/componts/kefu/kefu.vue';
	import search from '@/componts/index_comp/search.vue';
	import listTypeOne from '@/componts/index_comp/list.vue';
	import couponList from '@/componts/index_comp/couponlist.vue';
	import danImg from '@/componts/index_comp/dan_img.vue';
	import swiperImg from '@/componts/index_comp/swiperImg.vue';	
	import shopList from '@/componts/index_comp/shopList.vue';
	import listGroup from '@/componts/index_comp/listGroup.vue';
	import listGroup2 from '@/componts/index_comp/listGroup2.vue';
	import indexTitle from '@/componts/index_comp/index_Title.vue';
	import barHeng from '@/componts/index_comp/bar_heng.vue';
	import shopTimeGoods from '@/componts/index_comp/shop_time_goods.vue';
	import bar from '@/componts/index_comp/bar.vue';
	import vip from '@/componts/index_comp/vip.vue';
	export default {
		components:{
		    kefu,
			search,
			listTypeOne,
			couponList,
			danImg,
			swiperImg,
			shopList,
			listGroup,
			indexTitle,
			barHeng,
			shopTimeGoods,
			bar,
			vip,
			listGroup2
		},
		data() {
			return {
				style:{},
				guanGao_info:{},
				dataList:[],
				BarIndex:null,
				loading:true,
				gongGaoList:[ //滚动公告信息
					
				],
				// ------------------以上是測試數據
				index_info:[],
                isok:false,
                time:'',//时间
                content:'',//公告内容
				bannerlist:[],//banner的列表
				buyList:[],
				kor_type:'',
				type_choose:false,
				pop_show:false,
				navPadding:'0px',
				isOver:false,
				list:[],
				page:10,
				limit:1,
				total:0,
				flowList: [],
				value:1,
				goodsInfo:{
					pic:['']
				},
				gao_arr:[],
				gaolist:[],
				couponList:[]
				
			}
		},
		onLoad(e) {
			const res = uni.getSystemInfoSync()
			this.navPadding = res.statusBarHeight+6+'px'
			var height = res.statusBarHeight
			this.page = 1
            // this.openPopup()
			var token = uni.getStorageSync('token')
			if(token){
				this.openCoupon()
			}
		},
		
		onShow() {
			var style =  uni.getStorageSync('style')
			style = JSON.parse(style)
			this.style = style
			console.log(this.style , '全局样式')
            let now = new Date();
            let year = now.getFullYear();
            let month = now.getMonth() + 1;
            let day = now.getDate();
            this.time = `${year}-${month}-${day}`
			// uni.setStorageSync('token' , 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJrZXkiLCJhdWQiOiIiLCJpYXQiOjE3MzA0Mjg5OTQsIm5iZiI6MTczMDQyODk5NywiZXhwIjoxNzMwNDU3Nzk0LCJkYXRhIjp7InVpZCI6MSwiY29kZSI6IlhLVy0xMDAwMCIsImtvcl9jb2RlIjoiWkRILTEwMDAiLCJuaWNrbmFtZSI6ImJ1YnUiLCJhZG1pbl91c2VyX2lkIjoyfX0.O6ZSkPLTWNyl4Fyk_96S42M1q4c92uv_bf-dSmsabT0')
			this.kor_type = uni.getStorageSync('kor_type')?uni.getStorageSync('kor_type'):''
			if(this.kor_type == ''){
				uni.setStorageSync('kor_type' , 'kor')
				this.kor_type = 'kor'
			} 
			this.getInfo()
		},
		onShareAppMessage(e) {
			return {
				title: '秋刀鱼在日本',
				path: e.webViewUrl,
			}
		},
		onShareTimeline(e){
			return {
				title: '秋刀鱼在日本',
				path: e.webViewUrl,
			}
		},
		methods: {
			list_chagne(e , index){
				this.index_info[index].data = e
			},
			take(){
				this.couponList.forEach((item,index)=>{
					this.$wqzApi.coupon_record({coupon_id:item.id}).then(res=>{
						if(res.code == 200){
							uni.showToast({
								title:'领取成功',
								icon:'success'
							})
							this.$refs['center1'].close();  
						}
						// this.$refs.paging.complete(res.data.list);
					}).catch(err=>{
						// this.$refs.paging.complete(false);
						uni.showToast({
							title:'请重试',
							icon:'none'
						})
					})
				})

			},
			queryList(page , limit){
				var data = {
					page:page,
					limit:20,
					order_by_type:3
				}
				this.$wqzApi.index_goods_list(data).then(res=>{
					this.$refs.paging.complete(res.data.list);
				}).catch(err=>{
					this.$refs.paging.complete(false);
				})
			},
			gonggao(item){
				
				var url = `/pages/xieyi/xieyi?title=${item.name}&id=${item.id}`
				uni.navigateTo({
					url: url,
				});
				// 
				
			},
			search_to(e){
				
				var url = `/pages/classification/goodsList?title="商品列表"&search=${e}`
				this.navto(url)
			},
			getgonggao(item){
				// var arr = []
				// item.data.forEach((item,index)=>{
				// 	arr.push(item.name)
				// })
				
				var data = {
					id:25
				}	
				this.$wqzApi.index_news_detail(data).then(res=>{
					this.guanGao_info = res.data
					this.guanGao_info.content = this.$filterImg(this.guanGao_info.content)
					this.gao_arr = [this.guanGao_info.name]
				})
			},
			gogngaoClose(){
				this.$refs['center'].close();    
			},
			getInfo(){
				this.$gugoApi.Index_floor({}).then(res=>{
					console.log(res.data)
					res.data.forEach((item,index)=>{
						if(item.type == 2){
							this.getgonggao(item)
						}
						if(res.data[index].style){
							res.data[index].style = JSON.parse(res.data[index].style);
						}else{
							res.data[index].style = {}
						}
						
						
						if(item.type == 8){
							res.data[index].data.map((ite,ind)=>{
								var picList = ite.pic.split(',')
								ite.pic = picList[0]
							})
						}
					})
					this.index_info = res.data
					this.loading = false
				}).catch(err=>{
					
				})
			},
			swiperClick(e){
				var url = this.bannerlist[e].link
				this.navto(url)
			},
			closeTypeChoose(ref){
				this.$refs[ref].close()	
			},
			
			closeTypeChoose1(ref1){
				this.$refs[ref1].close()
			},
			openxian(){
				this.$refs['type_choose'].open()
			},
            todyIS_no(){
                
                this.isok = !this.isok
                if(this.isok){
                    uni.setStorageSync('isToday' , this.time)
                }else{
                    uni.setStorageSync('isToday' , null)
                }
            },
            openPopup() {
                this.$wqzApi.index_news_status({}).then(res=>{
                    if(res.data){
                        // 判断有推荐内容的公告
                        if(uni.getStorageSync('isToday') == this.time){
                            // 判断为今日不再弹出
                        }else{
                            // 有内筒并且没有选择今日不在弹出
                            this.content = this.$filterImg(res.data.content?res.data.content:'')
                            this.$refs['center'].open();    
                        }
                    }
                    
                })
            },
			// 领取优惠券
			openCoupon() {
			    this.$wqzApi.UserCouponPopup({}).then(res=>{
					
					
					
					console.log(res.data.length)
					if(uni.getStorageSync('token') && res.data.length >0){
						
						this.couponList = res.data
						
						this.$refs['center1'].open();   
					}
			        // if(res.data){
			        //     // 判断有推荐内容的公告
			        //     if(uni.getStorageSync('isToday') == this.time){
			        //         // 判断为今日不再弹出
			        //     }else{
			        //         // 有内筒并且没有选择今日不在弹出
			        //         this.content = this.$filterImg(res.data.content?res.data.content:'')
			        //         this.$refs['center'].open();    
			        //     }
			        // }
					
					
					
			        
			    })
			},
			seeInfo(item){
				uni.navigateTo({
					url:'/pages/shop_info/shop_info?id='+item.id
				})
			},
			choosekor(type){
				uni.setStorageSync('kor_type' , type)
				this.getBanner()
				// this.type_choose = false
				this.$refs['type_choose'].close()
				this.kor_type = type
			},
			
			// 微信支付
			wxPay(){
				
				var token = uni.getStorageSync('token')
				if(!token){
					uni.setStorageSync('isModule' , true)
					uni.showModal({
						title: '登录',
						content: '登录后可使用完整功能',
						cancelText: "取消", // 取消按钮的文字  
						confirmText: "确认", // 确认按钮的文字  
						showCancel: true, // 是否显示取消按钮，默认为 true
						success: (res) => {
							uni.setStorageSync('isModule' , false)
						if(res.confirm) {  
							uni.navigateTo({
								url:'/pages/login/login'
							})
						} else {  
							uni.switchTab({
								url:'/pages/index/index'
							})
							}  
						} 
					})
					return
				}
				uni.showLoading({
					title:'支付中',
				})
				var data = {
					id:this.goodsInfo.id,
					num:this.value
				}
				this.$wqzApi.reshoot_goods_pay(data).then(res=>{
					window.location.href = res.data
					// var data =JSON.parse(res.data)
					// 吊起微信支付
					// wx.requestPayment({
					//   timeStamp: data.timeStamp,
					//   nonceStr: data.nonceStr,
					//   package: data.package,
					//   signType: 'MD5',
					//   paySign: data.paySign,
					//   success (res) {
					// 	  uni.hideLoading()
					// 	  uni.showToast({
					// 	  	title:'支付成功',
					// 		icon:'none'
					// 	  })
					// 	 this.$refs.paging.reload()	
					//   },
					//   fail (res) {
					// 	  uni.hideLoading()
					// 	 //  uni.showToast({
					// 	 //  	title:res.errMsg,
					// 		// icon:'error'
					// 	 //  })
					//   }
					// })
				}).catch(err=>{
					uni.hideLoading()
					uni.showToast({
						title:'支付失败',
						icon:'none'
					})
				})
			},
			valChange(e){
				this.value = e.value
			},
			openPop(item){
				var data = {
					id:item.id
				}
				this.value = 1
				uni.showLoading()
				this.$wqzApi.index_goods_detail(data).then(res=>{
					uni.hideLoading()
					this.pop_show = true
					res.data.pic = res.data.pic.split(',')
					this.goodsInfo = res.data
				}).catch(err=>{
					uni.hideLoading()
				})
			},
			getList(){
				var data = {}
				this.$wqzApi.index_goods_list({type:1}).then(res=>{
					// 补拍商品
					res.data.list.forEach((item,index)=>{
						res.data.list[index].pic = item.pic.split(',')
					})
					setTimeout(()=>{
						this.total = res.data.count
						this.flowList = this.flowList.concat(res.data.list) 
					},100)
				}).catch(err=>{
					
				})
				this.$wqzApi.index_goods_list({type:2 , recommend:1}).then(res=>{
					// 代买商品
					res.data.list.forEach((item,index)=>{
						res.data.list[index].pic = item.pic.split(',')
					})
					setTimeout(()=>{
						this.total = res.data.count
						this.buyList = res.data.list
					},100)
					
				}).catch(err=>{
					
				})
			},
			lower(){
				if(this.flowList.length<this.total){
					// 开始分页
					this.getList()
				}
			},
			getBanner(){
				this.$wqzApi.index_banner({}).then(res=>{
					this.list = []
					this.bannerlist = res.data
					var arr = res.data
					arr.forEach((item,index)=>{
						var date = {
							image:item.file
						}
						this.list.push(date)
					})
				})
			},
			navto(url){
				uni.navigateTo({
					url:url
				})
			}
		}
	}
</script>

<style lang="scss">
	@import url('./index.scss');
</style>
